<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <link rel="shortcut icon" href="/cwp/favicon.ico" type="image/x-icon" />
    <title>中移在线智慧园区</title>

    <!--引入CSS文件-->
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/style.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/list.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/tabs.css" />
	<link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/taqs.css" />
	<link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/btn.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/infoBox.css" />

    <!--引入bootstrap CSS文件-->
    <link rel="stylesheet" type="text/css" href="../../assets/lib/bootstrap-3.3.5-dist/css/bootstrapModel.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/lib/bootstrap-3.3.5-dist/css/bootstrap-theme.min.css" />

    <!--日历组件-->
    <link rel="stylesheet" type="text/css" href="../../assets/lib/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" />

    <style>
        .t-box.t-apply-box{
            border: none;
            border-bottom: 1px solid #ddd;
        }
        .t-apply-box .t-box-title-box {
            padding: 0;
            border: none;
            margin-bottom: -1px;
            position: relative;
            z-index: 10;
        }
        .t-apply-box .t-box-title-btn {
            border-bottom: 1px solid #ddd;
            display: inline-block;
            line-height: 40px;
            padding: 0 15px;
            margin-right: -4px;
            cursor: pointer;
        }
        .t-apply-box .t-box-title-btn.btnSel{
            border-top:3px solid #4b9ff5;
            border-left:  1px solid #ddd;
            border-right:  1px solid #ddd;
            border-bottom: 1px solid #fff;
        }
        .t-apply-box .box-body{
            border: 1px solid #ddd;
            border-bottom: none;
            height: 249px;
            padding-top: 10px;
        }
        .tipInputBox li{
            width: 100%;
        }
        .tipInputBox li label{
            display: block;
            width: 30%;
            height: 20px;
            line-height: 20px;
            margin-right: 10px;
            text-align: right;
        }
        .tipInputBox li input{
            display: block;
            width: 150px;
        }
        .tipInputBox li select{
            display: block;
            width: 154px;
            height: 20px;
        }
        .modal-body p {
            line-height: 20px;
        }
        .modal-footer .btn{ margin: 0; }

        .t-norecord { text-align: center; }
        .t-norecord p { display: inline-block; }
    </style>

</head>
<body>

<!--头部文件 开始-->
<!--<div id="header"></div>-->
<!--头部文件 结束-->

<div class="wrapper">
    <!--左侧菜单 开始-->
    <!--<div id="left-menu"></div>-->
    <!--左侧菜单 结束-->

    <!--右侧内容 开始-->
    <div class="wrapper">
        <div class="right-scroll">
            <div class="t-list">
                <div class="t-list-title" style="border-bottom: none">
                    <h2>首页 > 宿舍管理 > 商住房管理</h2>
                </div>
                <div class="t-box t-apply-box">
                    <div class="t-box-title t-box-title-box" id="myTabs">
                        <span class="t-box-title-btn btnSel" data-type="1">全部</span>
                        <span class="t-box-title-btn" data-type="-1">已入住</span>
                        <span class="t-box-title-btn" data-type="0">未入住</span>
                    </div>
                    <div class="t-list-result clearfix">
                        <!-- 列表 -->
                        <div class="t-table clearfix" id="houseTableData"></div>
                        <!-- 分页 -->
                        <div class="pagination" id="houseTableDataPagination" style="margin-bottom: 10px;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!--弹窗Dialog-->
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" id="dialog">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">

        </div>
    </div>
</div>

<!--版权-->
<!--<div id="copyright"></div>-->

<!--提示模态框-->
<div class="modal fade bs-example-modal-sm" id="myTip" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-body" style="text-align:center;font-size:14px;">
                <i id="icon-tip" style="margin-right:6px;"></i>
                <span class="tip-info"></span>
            </div>
        </div>
    </div>
</div>


<!--jQuery库脚本-->
<!--非IE8浏览器-->
<!--[if !(IE 8)]><!--><script type="text/javascript" src="../../assets/lib/jquery/jquery.min.js"></script><!--<![endif]-->
<!--IE8浏览器-->
<!--[if IE 8]><script type="text/javascript" src="../../assets/lib/jquery/jquery-ie8.min.js"></script><![endif]-->
<script type="text/javascript" src="../../assets/lib/jQuery-slimScroll-1.3.8/jquery.slimscroll.min.js"></script>

<script src="../../assets/common/loadHeaderAndCopyright.js"></script>
<script src="../../assets/lib/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>

<!--bootsrtap日历控件脚本-->
<script src="../../assets/lib/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
<script src="../../assets/lib/bootstrap-datetimepicker-master/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>

<!--bootstrap 弹窗插件扩展-->
<script src="../../assets/lib/bootbox/bootbox.min.js"></script>

<script src="../../assets/lib/tipModal/js/tipModal.js"></script>
<script src="../../assets/common/centerModal.js"></script>
<script src="../../assets/common/ajaxPoster.js"></script>

<!--模板引擎-->
<script charset="utf-8" src="../../assets/lib/artTemplate/template.js"></script>

<!--分页脚本-->
<script charset="utf-8" src="../../assets/lib/pagination/1.2.1/jquery.pagination.js"></script>
<script src="../../assets/common/loaderTable.js"></script>

<script src="../../static/js/dormManger/businessHouse.js"></script>

<!--房间列表模板-->
<script type="text/html" id="houseListTpl">
    {{each beans}}
    <div class="info-box">
        <span class="info-box-icon {{$value.roomTypeDictdataId | roomTypeDictdataIdType}}" style="position: relative;">
            <span class="info-box-tilte">
                {{$value.roomTypeDictdataId | roomTypeDictdataIdName}}
            </span>
            <span class="info-box-tilte">
                {{$value.roomNumber}}
            </span>
            {{ if findRole(roles, [56, 60]) }}
                <div style="position: absolute; bottom: 0; width: 100%">
                    <span class="house-operate btn-warning editRoom" data-roomId="{{$value.roomId}}">
                        管理房间
                    </span>
                </div>
            {{ /if }}
        </span>
        <div class="info-box-wrapper">
            <div class="info-box-content">
                <div class="info-box-text clearfix {{$value.activeStatus | activeStatusHide}}">
                    <div class="info-box-content-title">
                        入住人
                    </div>
                    <div class="info-box-content-details">
                        &nbsp;{{$value.userName}}
                    </div>
                </div>
                <div class="info-box-text clearfix">
                    <div class="info-box-content-title">
                        房间状态
                    </div>
                    <div class="info-box-content-details" style="color:{{$value.activeStatus | activeStatusColor}};">
                        &nbsp;{{$value.activeStatus | activeStatusShow}}
                    </div>
                </div>
                <div class="info-box-text clearfix">
                    <div class="info-box-content-title">
                        房间简介
                    </div>
                    <div class="info-box-content-details">
                        &nbsp;{{$value.roomDesc}}
                    </div>
                </div>
            </div>
            {{ if findRole(roles, [8, 56, 57, 60]) }}
                <div class="house-operate-footer">
                    {{ if $value.activeStatus == '1' }}
                        <span class="house-operate btn-danger clearRoom" data-roomid="{{$value.roomId}}">
                            置空
                        </span>
                        <span class="house-operate btn-success editCustomer" data-roomid="{{$value.roomId}}">
                            续住
                        </span>
                    {{ else }}
                        <span class="house-operate btn-primary applyRoom" style="width: 100%;" data-roomId="{{$value.roomId}}">
                            开房
                        </span>
                    {{ /if }}
                </div>
            {{ /if }}
        </div>
        </div>
    </div>
    {{/each}}
</script>

<!--新增房间模板-->
<script type="text/html" id="addHouseTpl">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">新增商住房</h4>
    </div>
    <div class="modal-body">
        <ul class="t-columns-group tipInputBox">
            <li>
                <label>楼栋</label>
                <select class="editBuildingId">

                </select>
            </li>
            <li>
                <label>楼层号</label>
                <select class="editFloorNo">

                </select>
            </li>
            <li>
                <label>房间类型</label>
                <select class="dormitoryType">
                    <option value="1009011">单间</option>
                    <option value="1009022">标间</option>
                    <option value="1009033">套房</option>
                </select>
            </li>
            <li>
                <label>房间号</label>
                <input type="text" class="dormitoryNb" maxlength="4" />
            </li>
            <li>
                <label>房间简介</label>
                <input type="text" class="dormitoryDesc" maxlength="30" />
            </li>
        </ul>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary addHouse">确定</button>
    </div>
</script>

<!--修改删除房间模板-->
<script type="text/html" id="editHouseTpl">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">管理房间</h4>
    </div>
    <div class="modal-body">
        <ul class="t-columns-group tipInputBox">
            <li>
                <label>楼栋</label>
                <select class="editBuildingId">

                </select>
            </li>
            <li>
                <label>楼层</label>
                <select class="editFloorNo">

                </select>
            </li>
            <li>
                <label>房间类型</label>
                <select class="dormitoryType">
                    <option value="1009011">单间</option>
                    <option value="1009022">标间</option>
                    <option value="1009033">套房</option>
                </select>
            </li>
            <li>
                <label>房间号</label>
                <input type="text" class="dormitoryNb" maxlength="4" value="{{ roomNumber }}"/>
            </li>
            <li>
                <label>房间简介</label>
                <input type="text" class="roomDesc" maxlength="30" value="{{ roomDesc }}"/>
            </li>
        </ul>
        <input type="hidden" class="dormitoryId" value="{{ roomId }}">
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-danger delDormitory" data-roomId="{{ roomId }}">删除房间</button>
        <button type="button" class="btn btn-primary" id="editDormitoryBtn">修改房间</button>
    </div>
</script>

<!--开房模板-->
<script type="text/html" id="addCustomerTpl">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">填写入住人信息</h4>
    </div>
    <div class="modal-body">
        <ul class="t-columns-group tipInputBox">
            <li>
                <label>姓名</label>
                <input type="text" value="{{ userName }}" class="userName" maxlength="20"/>
            </li>
            <li>
                <label>电话</label>
                <input type="text" value="{{ phone }}" class="phoneNo" maxlength="11"/>
            </li>
            <li>
                <label>身份证号</label>
                <input type="text" value="{{ identityCard }}" class="idCard" maxlength="18"/>
            </li>
            <li>
                <label>开始时间</label>
                <input type="text" class="form_date_hour_start" value="{{ startDate }}" readonly/>
            </li>
            <li>
                <label>结束时间</label>
                <input type="text" class="form_date_hour_end" value="{{ endDate }}" readonly/>
            </li>
        </ul>
        <input type="hidden" value="{{ roomId }}" id="addInput">
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary" id="addCustomer">开房</button>
    </div>
</script>

<!--续住模板-->
<script type="text/html" id="editCustomerTpl">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">续住</h4>
    </div>
    <div class="modal-body">
        <ul class="t-columns-group tipInputBox">
            <li>
                <label>姓名</label>
               <p>{{ userName }}</p>
            </li>
            <li>
                <label>电话</label>
                <p>{{ phone }}</p>
            </li>
            <li>
                <label>身份证号</label>
                <p>{{ identityCard }}</p>
            </li>
            <li>
                <label>开始时间</label>
                <p class="form_date_hour_start">{{ startDate }}</p>
            </li>
            <li>
                <label>结束时间</label>
                <input type="text" class="form_date_hour_end" value="{{ endDate }}" readonly/>
            </li>
        </ul>
        <input type="hidden" value="{{ applyRequestId }}" id="DelayInput">
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary" id="confirmDelay">确认</button>
    </div>
</script>



</body>
</html>

